@charset "utf-8";
/* CSS Document */

.index_banner .wapimg{ display:none;}
.index_banner .slick-prev,
.index_banner .slick-next{ background-color:transparent; border-color:#fff}
.index_banner .slick-prev{ left:5%;background-image: url(../js/slick/slick-prev-on.png);}
.index_banner .slick-next{ right:5% ;background-image: url(../js/slick/slick-next-on.png);}
.index_banner .slick-prev:hover,
.index_banner .slick-next:hover{ background-color:#014099;border-color:#014099}

.index_title{ line-height:40px; padding:3% 0;}
.index_title b{ font-size:36px; font-weight:normal; display:block}
.index_title span{ font-size:16px; opacity:0.5; display:block;  text-transform:uppercase; letter-spacing:8px;}

.index_icon{ position:relative;}
.index_icon a{ animation: mapicon 1s ease-in 0.5s infinite; position:absolute; left:50%; margin-left:14px; bottom:80px; z-index:10; display:block; width:27px; height:55px; background:url(../images/roll_icon.png) no-repeat center center;}

@keyframes mapicon {
     0% {top:-90px;}
     50% {top:-60px;}
     100% {top:-90px;}
  }
@-moz-keyframes mapicon {
     0% {top:-90px;}
     50% {top:-60px;}
     100% {top:-90px;}
  }
@-webkit-keyframes mapicon {
     0% {top:-90px;}
     50% {top:-60px;}
     100% {top:-90px;}
  }
@-o-keyframes mapicon {
     0% {top:-90px;}
     50% {top:-60px;}
     100% {top:-90px;}
  }

.index_about .photo{ width:41.667%; padding-top:0; box-shadow: 11px 11px 16px rgba(82, 143, 190, 0.11);}
.index_about .photo img{ border-radius:4px;}

.index_product .item{ float:left; width:49.405%; position:relative}
.index_product .item:before{content:''; opacity:0; z-index:2; position:absolute; width:100%; height:100%; display:block; background-color:rgba(1,64,153,0.8); transition: opacity 1s;}
.index_product .item:nth-child(odd){ clear:both; margin-right:1.19%;}
.index_product .photo{ overflow:hidden;}
.index_product .photo img{ transition: .5s; z-index:1}
.index_product .intro{ z-index:5; line-height:30px; font-size:16px; bottom:0; padding:10% 15%; color:#fff; position:absolute; width:100%; transition:all 1s}
.index_product .intro h2{ font-size:24px;}
.index_product .intro p{ padding:20px 0;}
.index_product .intro .more{ color:#fff; display:inline-block; width:118px; line-height:38px; text-indent:27px; border:solid 1px #fff; border-radius:100px;transition:transform 0.6s; background:url(../images/more_jt.png) no-repeat 80%;}
.index_product .item:hover:before{ opacity: 1;  transition-duration: 1s;}
.index_product .item:hover .intro{ bottom:10%;}
.index_product .item:hover .photo img{transform:scale(1.1);}

.index_ability,
.index_ability .item{ position:relative}
.index_ability .photo{ background-color:#00132e}
.index_ability .photo img{ opacity:0.7;transition: .5s; }
.index_ability .photo:hover img{ opacity:1}
.index_ability .intro{ line-height:32px; font-size:16px; position:absolute; color:#fff; left:12%; top:15%; max-width:755px; z-index:10}
.index_ability .intro h2{ font-size:36px;}
.index_ability .intro h3{ font-size:24px; padding:40px 0}
.index_ability .ability-nav{ position:absolute; width:100%; bottom:5%; text-align:center; z-index:5}
.index_ability .ability-nav:before{ content:''; top:50%; margin-top:-0.5px; display:block; position:absolute; width:100%; height:1px; background-color:rgba(255,255,255,0.3)}
.index_ability .ability-nav h2{ color:#fff; font-size:18px; line-height:60px;}
.index_ability .ability-nav .yuan{transition: .5s; display:block; width:14px; height:14px; margin:auto; border-radius:100px; border:solid 1px rgba(255,255,255,0.5); position:relative;}
.index_ability .ability-nav .yuan:before{ content:''; width:18px; height:18px; left:-5px; top:-5px; position:absolute; display:block;  border-radius:100px;}
.index_ability .ability-nav .slick-current .yuan{ background-color:#fff; border:none;width:10px; height:10px;}
.index_ability .ability-nav .slick-current .yuan:before{border:solid 1px #fff; }

.index_development{ padding-top:5%; padding-bottom:5%}
.index_development .intro{ font-size:16px; float:left; width:52%; line-height:32px;}
.index_development .intro .h1{ font-size:24px; padding:3% 0; color:#014099}
.index_development .photo{ float:right; width:40.817%; box-shadow: 11px 11px 16px rgba(82, 143, 190, 0.11);}
.index_development .photo img{ border-radius:4px;}

.index_news{ padding-bottom:4%;}
.index_news .more_all{ float:right; z-index:5; position:relative}
.index_news .item{ float:left; width:32.143%;}
.index_news .item a{ display:block;}
.index_news .item .photo{ overflow:hidden;}
.index_news .item .photo span{ display:block; padding-bottom:66.668%; background:no-repeat center center;  background-size: cover;  transition: .5s;}
.index_news .item .intro{ color:#555555; padding:5% 10%; border-bottom:solid 1px #eeeeee; transition: .5s;}
.index_news .item h2{ font-size:16px; height:48px; overflow:hidden;}
.index_news .item p{ margin:20px 0; opacity:0.7; height:48px; overflow:hidden;}
.index_news .item time{ opacity:0.7;}
.index_news .item:nth-child(2){ margin:0 1.7855%;}
.index_news .item:hover .intro{ color:#fff; background-color:#004098;}
.index_news .item:hover time{ opacity:1;}
.index_news .item:hover .photo span{opacity:.5;transform:scale(1.1);}

@media(max-width:1024px){
.index_title b{ font-size:28px;}

.index_product .intro{ line-height:24px; font-size:14px; padding:5%}
.index_product .intro h2{ font-size:18px;}
.index_product .intro .more{ line-height:34px}

.index_ability .intro{ position:relative; left:auto; top:auto; color:#555; padding:2%; font-size:14px}
.index_ability .intro h2{ font-size:20px; color:#014099}
.index_ability .intro h3{ font-size:16px; padding:10px 0;}
.index_ability .ability-nav{ bottom:0}
.index_ability .ability-nav .icon img{ width:40px;}
.index_ability .ability-nav h2{ font-size:16px; line-height:40px;}
.index_ability .more_all a.white{background-color:#014099; border-color:#014099;}
}
@media(max-width:768px){
.index_banner .pcimg{ display:none;}
.index_banner .wapimg{ display:block;}

.index_title{ line-height:30px;}
.index_title b{ font-size:24px;}
.index_title span{ font-size:12px;letter-spacing:4px;}

.index_about .photo{ float:none; width:100%}

.index_product .item{ float:none; width:100%; margin:2% 0!important}



.index_development .intro,
.index_development .photo{ float:right; width:100%;}
.index_development .intro{ font-size:14px; padding-bottom:3%}
.index_development .intro .h1{ font-size:18px;}

.index_news .item{ float:none; width:100%;}
.index_news .item:nth-child(2){ margin:2% 0;}
.index_news .item .intro{ padding:2%}
}